﻿import Taro, { Component } from '@tarojs/taro'
import { Swiper, SwiperItem, Image, View, Text } from '@tarojs/components'
import '../../assets/common.scss'
import CommonJs from '../../utils/common'
import Hearder from './hearder'
import './index.scss'

export default class Index extends Component {
  constructor(props) {
    super(props)
    var dt_date={
      result:[]
    }
    this.state = {
      qun_date:'',
      dt_date:dt_date,
      imglist:[],
      type:1,//区分动态和说一说页
      bigimgindex:0,//查看大图时当前点击图片
      isindex:1,//用于判断是否是动态界面
      navindex:2,//用于判断导航选中
      felelist:[],//分类标签
      data_num:0,//分类默认选中全部标签
      pageheight:0,//获取高度
      qid:Taro.getStorageSync('dateinfo').qid,
      isload:0,//判断页面是否加载完成
      pageNumber:1,//页码数
      scrollPd:false,//是否可滑动
      hasNextPage: false,//是否有下一页
      znwn:''
    }
  }
  config = {
    navigationBarTitleText:'加载中'
  }
  open(url,type){
    //储存type区分页面
    // this.setState({
    //   type: type,
    //   dt_date:{
    //     result:[]
    //   },
    //   znwn:'',
    //   data_num:0
    // })
    // if(this.state.isindex==1){
    //   if(type==1){
    //     this.getdt(0,1)
    //     this.getfenlei(type)
    //   }
    //   else if(type==2){
    //     this.getsys(0,1)
    //     this.getfenlei(type)
    //   }
    //   else{
    //     CommonJs.open(url);
    //   }
    // }
    // else{
    //   CommonJs.open(url);
    // }
    this.setState({
      type: type
    })
    this.$preload({
      type:type
    })
    CommonJs.open(url)
  }

 

  getfenlei(type){
    //获取动态，说一说分类标签
    var _this=this
    var date1={
      type:type,
      status:1,
      clusterId:_this.state.qid
    }
    CommonJs.ajaxRequest('/categoryOfShare/queryPageData',date1,'GET',function(res){
      _this.setState({
        felelist: res.content.result
      })
    })
  }

  //点击分类标签获取动态或说一说
  getdotiso(id){
    this.setState({
      data_num:id,
      dt_date:{
        result:[]
      },
      znwn:''
    })
    if(this.state.type==2){
      this.getsys(id,1)
    }else{
      this.getdt(id,1)
    }
  }
  getquninfo(){
      var date1={id:this.state.qid}
      var _this=this;
      // console.log(this.state.qid+'//111')
      CommonJs.ajaxRequest('/cluster/getEntityAndLoginId',date1,'GET',function(res){
      // console.log(JSON.stringify(res)+'//22')
      Taro.setNavigationBarTitle({title:res.content.name+"社群"})
      var query=Taro.createSelectorQuery()
      query.select('.qun-bgbanner').boundingClientRect(function(rect){
        var height=_this.state.pageheight
        _this.setState({
            qun_date: res.content,
            pageheight:height-rect.height
        })
      }).exec();
    })
  }

  onShareAppMessage(res){
    let title = '"'+this.state.qun_date.name+'社群"，点击进入，和我一起参加活动吧'
    let path = '/pages/activity/activity?scene='+this.state.qun_date.id
    let imageUrl = this.state.qun_date.photo
    return CommonJs.onShareAppMessage(title, path, imageUrl)
  }

  getdt(id,pageNumber){
    // console.log(id+'id'+pageNumber+'pageNumber'+'88888888888888888888888888888888888888888')
    var _this=this;
    _this.setState({
        navindex:2
     })
    //获取动态
    var date2={
      shareType:2,
      pageNumber:pageNumber,
      clusterIdStr:'0,'+_this.state.qid,
      categoryOfShareId:id
    }
    CommonJs.ajaxRequest('/share/querySharePageData',date2,'GET',function(res){
      // console.log(JSON.stringify(res)+'//555555555555555555')
      var hasNextPage = res.hasNextPage
      var result = res.result
      var dtda = _this.state.dt_date
      for(var i = 0; i < result.length; i++){
        dtda.result.push(result[i])
      }
      if(hasNextPage){
        _this.setState({
          znwn: '暂无动态',
          dt_date: dtda,
          pageNumber: res.pageNumber,
          hasNextPage: hasNextPage,
          scrollPd: true
        })
      }else{
        _this.setState({
          znwn: '暂无动态',
          dt_date: dtda,
          pageNumber: res.pageNumber,
          hasNextPage: hasNextPage,
          scrollPd: false
        })
      }
    })
  }
  getsys(id,pageNumber){
    //获取说一说
    this.setState({
        navindex:2
     })
    var date={
      shareType:4,
      pageNumber:pageNumber,
      clusterIdStr:'0,'+this.state.qid,
      categoryOfShareId:id
    }
    var _this=this;
    CommonJs.ajaxRequest('/share/querySharePageData',date,'GET',function(res){
      var hasNextPage = res.hasNextPage;
      var result = res.result;
      var dtda = _this.state.dt_date;
      // console.log(result.length+'888888888888'+JSON.stringify(dtda))
      for(var i = 0; i < result.length; i++){
        dtda.result.push(result[i]);
      }
      // console.log('0000000000000000000'+JSON.stringify(dtda))
      if(hasNextPage){
        _this.setState({
          dt_date: dtda,
          pageNumber: res.pageNumber,
          hasNextPage: hasNextPage,
          scrollPd: true,
          znwn:'暂无说一说'
        })
      }else{
        _this.setState({
          dt_date: dtda,
          pageNumber: res.pageNumber,
          hasNextPage: hasNextPage,
          scrollPd: false,
          znwn:'暂无说一说'
        })
      }
    })
  }

  loadMore(){
    var _this = this;
    var pd = _this.state.scrollPd;
    if(pd) {
      //防止多次触发滑动到底部事件
      _this.setState({
        scrollPd: false//禁止下拉
      })
      var pageNumber = _this.state.pageNumber + 1;
      var data_num = _this.state.data_num;
      if(_this.state.type == 2){
        _this.getsys(data_num,pageNumber);
      }else{
        _this.getdt(data_num,pageNumber);
      }
    }else{
      var hasNextPage =  _this.state.hasNextPage;
      if(hasNextPage){
        Taro.showToast({
            title:'正在加载数据...',
            icon: 'none',
            duration: 2000
          });
      }else{
        Taro.showToast({
            title:'没有更多数据啦！',
            icon: 'none',
            duration: 2000
          });
      }
    }
  }

  dotime(str){
    var time = parseInt(new Date()-new Date(str))/1000;
    if(parseInt(time/(365*60*60))<=0){
        if(parseInt(time/(30*24*60*60))<=0){
            if(parseInt(time/(24*60*60))<=0){
                if(parseInt(time/(60*60))<=0){
                    if(parseInt(time/60)<=0){                          
                        time = parseInt(time) + "秒前";
                    }else{
                        time = parseInt(time/60)+"分钟前";
                    };
                }else{
                    time = parseInt(time/(60*60))+"小时前";
                };
            }else{
                time = parseInt(time/(24*60*60))+"天前";
            };
        }else{
            time = parseInt(time/(30*24*60*60))+"月前";
        };
    }else{
        time = CommonJs.FormatDate(str);
    };
    return time;
  }
  opendetails(url,id){
    this.$preload('pagename',id);
    CommonJs.openTo(url);
  }
  opendetailis(url,str){
    // console.log(str+'44444444444444444444444')
    this.$preload({
      str: str
    })
    CommonJs.openTo(url)
  }
  lookbigimg(date,index){
    var _this = this
    _this.setState({
      imglist: date,
      bigimgindex:index
    })
    
  }
  close(){
    this.setState({
      imglist:[]
    })
  }

  getgroup(){
    //加群接口
    var _this=this
    var date={
      clusterId:_this.state.qid
    }
    CommonJs.ajaxRequest('/openClusterBindingUser/create',date,'GET',function(res){
     // console.log(JSON.stringify(res)+'//3333333333333')
    })
  }
  buzhichi(){
    Taro.showModal({
      title: '提示',
      content: '抱歉，小程序不允许你访问网页链接，如需获得最全功能和更好体验请下载“蝌蚪社区”APP!',
      showCancel: false
    })
  }
  lookhd(index){
  	var list=this.state.dt_date.result;
  	if(list[index].attachmentList){
	  	if(list[index].attachmentList[0].assortmentOfMediaType==4){
	  		if(list[index].attachmentList[0].identifyingInformation){
			  	this.$preload('activityId',list[index].attachmentList[0].identifyingInformation)
			    CommonJs.openTo("/pages/activitydetails/activitydetails")
			  }
		  }
	  }
  }
  componentWillMount () {
      var _this = this
      // _this.getquninfo()
      // _this.getgroup()
      var ctype=1
      if(_this.$router.preload){
        if(_this.$router.preload.type){
          _this.setState({
            type: _this.$router.preload.type
          })
          ctype=_this.$router.preload.type
        }
      }
      
      if (ctype==2) {
         _this.getfenlei(2)
         _this.getsys(0,1)
      } else {
        _this.getfenlei(1)
        _this.getdt(0,1)
      }
      Taro.getSystemInfo({
        success:function(res){
          _this.setState({
            pageheight: res.windowHeight,
            isload:1
          })
        }   
      })
      _this.getquninfo()
  }
  componentDidShow () {
  }
  render () {
    const list_date = this.state.qun_date
    const dt_date = this.state.dt_date
    return (
      <View className='page' style={this.state.isload==1?'display:block':'display:none'}>
        <View className='qun-release' onClick={this.buzhichi.bind(this)} style="display:none;">发布</View>
        <View className='bigimg-box' style={this.state.imglist.length>0?'display:block':'display:none'}> 
         <Swiper
            className='bigimg'
            circular
            indicatorDots
            current={this.state.bigimgindex}>
            {this.state.imglist.map((item, index) => ( 
            <SwiperItem>
              <View className='swiper'><Image mode='widthFix' src={this.state.type == 1 ? item.url : item.markurl} onClick={this.close}></Image></View>
            </SwiperItem>
            ))}
          </Swiper>
        </View>
        <View className='qun-bgbanner'>
          <Hearder propItem={list_date} porpNav={this.state.navindex} onHandOpen={this.open.bind(this)}></Hearder>
        </View>
        <ScrollView className='' scrollY='true' style={'height:'+this.state.pageheight+'px'} onScrollToLower={this.loadMore.bind(this,'')}>
          <View className='qun-sanxzg'>
            <View className='qun-sanxn'>
              <View className={this.state.data_num == 0 ? "qun-boqns checknav" : "qun-boqns"} onClick={this.getdotiso.bind(this,0)}>全部</View>
              {this.state.felelist.map((item, index) => (
              <View className={this.state.data_num == item.id ? "qun-boqns checknav" : "qun-boqns"}  onClick={this.getdotiso.bind(this,item.id)}>{item.name}</View>
              ))}
            </View>
          </View>
          <View className='qun-dt'> 
            <View className='qun-znwn displaynone' style={dt_date.result.length!=0?'display:none':'display:block'}>{this.state.znwn}</View>
            {dt_date.result.map((item, index) => (
              <View className='qun-dt-li'>
                <View className='mobile userinfo'>
                  <Image className='user-img' mode='scaleToFill' src={item.photo?item.photo:'https://minichat.g2ma.com/kedouimg/A6984900727459logo.png'} onClick={this.opendetails.bind(this,'/pages/persinfo/persinfo',item.authorId)}></Image>
                  <View className='user-name'>
                    <View className="auoth"><Text className='user-mz'>{item.authorName}</Text>分享了个链接</View>
                    <View className={item.attachmentList[0].assortmentOfMediaType==4?'qun-dt-text qun-dt-texta':'qun-dt-text'} onClick={this.lookhd.bind(this,index)}>
                     		<View className='qun-imgs qun-imgs01'>
                          <Image mode='scaleToFill' className='hd' src={item.attachmentList[0].url}></Image>
                        </View>
                        <View className='qun-dt'>{item.content}</View>
                     </View>
			               <View className='qun-dt-img' style={item.attachmentList != null&&item.attachmentList.length>1?'':'display:none'}>
			                    {item.attachmentList != null&& item.attachmentList.length>1?
			                      item.attachmentList.map((item1, index1) => (
			                      	<View>
				                        <View className='qun-imgs' style={this.state.type==1 ? 'display:block;' : 'display:none;'}>
				                          <Image mode='widthFix' src={item1.url} onClick={this.lookbigimg.bind(this,item.attachmentList,index1)}></Image>
				                        </View>
				                        
			                        </View>
			                      ))
			                      :
			                      ''
			                    }
			                </View>
			                <View className='user-time'>{this.dotime(item.createAt)}</View>
			              </View>
                  </View>
                </View>
                
            ))}
          </View>
        </ScrollView>
        
      </View>
    )
  }
}